import React, { Component } from 'react';
import {
  View,
  Text,
  StyleSheet,
} from 'react-native';


export default class BillDetailCell extends Component {
  render() {
    return (
      <View style={[styles.container, this.props.style]}>
        <View style={styles.cellLeftPart}>
          <Text style={{fontSize: this.props.fontSize}}>{this.props.leftText}</Text>
        </View>
        <View style={styles.cellRightPart}>
          <Text style={{fontSize: this.props.fontSize, color: this.props.rightTextColor}}>{this.props.rightText}</Text>
        </View>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    height: 30,
    flexDirection: 'row',
    backgroundColor: 'white',
  },
  cellLeftPart: {
    flexDirection: 'column',
    width: 100,
    paddingLeft: 10,
    justifyContent: 'center',
  },
  cellRightPart: {
    flex: 1,
    flexDirection: 'column',
    alignItems: 'flex-end',
    justifyContent: 'center',
    paddingRight: 10,
  }
})